<template>
	<view class="conent-box">
		<image class="background" :src="user.avatar"></image>
		<view class="mask"></view>
		<view class="video-big-box">
			<cover-view class="head-box" @tap="back">
				<cover-image class="back-image" src="../../../static/jingjie/return.png"></cover-image>
				<cover-view class="return-title">返回</cover-view>
			</cover-view>
			<video class="vide-box" controls :src="videosrc"></video>
		</view>


		<view class="body-box">
			<view class="content-box common">
				<view class="left-box-conent" :class="{textOverflow:active}">
					{{videoDate.title}}
				</view>
				<view class="right-box" @tap="more">
					<image src="../../../static/jingjie/xialajiantou.png"></image>
				</view>
			</view>
			<view class="watch-num">
				收益:<text class="shouyi">99879猫币</text>
				/ 围观:<text class="shouyi">{{videoDate.browse_count}}人</text>
			</view>
			<view class="" v-if="videoDate.content!=''">
				{{videoDate.content}}
			</view>
			<view class="share-box">
				<view class="share-box-small common">
					<view class="small-box" @tap="shuocang">
						<image src="../../../static/jingjie/shoucang_w.png"></image>
						<view class="wenzi">{{videoDate.collect_count}}</view>
					</view>
					<!-- 分享 -->
					<!-- #ifdef MP-WEIXIN -->
					<view class="small-box">
						<button open-type="share" plain="true" style=" width:23px; height:23px;border: none; background-clip: padding-box;" @tap="onShareAppMessage">
							<image class="shareImg" src="/static/jingjie/fenxiang.png"></image>
						</button>
						<text class="wenzi">{{videoDate.share_count}}</text>
					</view>
					<!-- #endif -->
					<!-- #ifdef APP-PLUS -->
					<view class="small-box" @tap="fenxiang">
						<image src="../../../static/jingjie/fengxiang.png"></image>
						<view class="wenzi">{{videoDate.share_count}}</view>
					</view>
					<!-- #endif -->
					<view class="small-box" @tap="dianzan">
						<image src="../../../static/jingjie/dianzan.png"></image>
						<view class="wenzi">{{videoDate.like_count}}</view>
					</view>
					<view class="small-box" @tap="moreComment">
						<image src="../../../static/jingjie/pinglun.png"></image>
						<view class="wenzi">{{videoDate.comment_count}}</view>
					</view>
				</view>
			</view>
		</view>

		<view class="comment-box">
			<view class="comment">
				<view class="hot-comment">热门评论</view>
				<view class="" v-if="nullComment==false">
					<view class="" v-for="(item,index) in hotCommentList" :key="index">
						<view class="comment-content">{{item.map.userinfo.nick_name}} :<text class="color-style">{{item.content}}</text></view>
					</view>
					<view class="more-box" @tap="moreComment">
						<text>查看更多</text>
						<image src="../../../static/jingjie/youjiantou.png"></image>
					</view>
				</view>
				<view class="text1" v-else>
					暂无评论
				</view>

			</view>
		</view>
		<view class="about-box common">
			<view class="about-left-box">
				<view class="user-box" @tap="toUserDetail(user.user_id)">
					<view class="user-img-box" >
						<image :src="user.avatar"></image>
					</view>
					<view class="user_new-box">
						<view class="user_nickName textOverflow">{{user.nick_name}}</view>
						<view class="user_infor">{{videoDate.create_time}}</view>
					</view>
				</view>
			</view>
			<view class="about-right-box textOverflow" @tap="tomoreCuriosityEntity">#{{curiosityEntity.content}}#</view>
		</view>
		<view class="conent-box-bottom">
			<view class="conent-head-box">相关推荐</view>
			<view class="recommend-box" v-for="(item,index) in tuijianList" :key="index" @tap="toDetail(item.id,item.style)">
				<view class="left-img-box">
					<image :src="item.coverPics"></image>
				</view>
				<view class="right-conent-box">
					<view class="fontStyle common-textEllipsis">{{item.title}}</view>
					<!-- <view class="class-title">#搞笑</view> -->
				</view>
			</view>
		</view>

		<view class="video-alert-box" v-if="isVideoComment">
			<!--回应和一级评论-->
			<view class="bianju">
				<view class="comment-box-other">
					<view class="comment">
						<view class="common">
							<view class="hot-comment-other">热门评论</view>
							<image @tap="closeAlert" class="delete" src="../../../static/jingjie/delete_h.png"></image>
						</view>
						<scroll-view class="scrllBox" scroll-y="true" v-if="hotCommentList.length!=0">
							<view class="comment-conent-box yi" v-for="(item,index) in hotCommentList" :key="index">
								<view class="first-level-comment">
									<image class="user-img" :src="item.map.userinfo.avatar"></image>
									<view class="comment-box-big">
										<view class="left-box">
											<view class="user-nickName">{{item.map.userinfo.nick_name}}</view>
											<view class="comment-content-box">{{item.content}}<text class="time-box">{{item.create_time}}</text></view>
										</view>
										<view class="">
											<view class="like-img-box" @tap="toLike(item.id,index,'hot')">
												<image v-if="item.map.is_like" class="like-img" src="../../../static/jingjie/hongxin.png"></image>
												<image v-else class="like-img" src="../../../static/jingjie/huixin.png"></image>
											</view>
											<view class="like-num">{{item.like_count}}</view>
										</view>

									</view>

								</view>
								<view class="more-right" @tap="toTwoComment(item.id,item.map.userinfo.nick_name,item.map.userinfo.user_id,'hotchild',index)">回复</view>
								<view class="two-level-comment" v-if="item.map.subComment&&item.map.subComment.length!=0" @tap="toTwoComment(item.id,item.map.subComment[0].map.userinfo.nick_name,item.map.subComment[0].map.userinfo.user_id,'hotchild',index)">
									<image class="two-user-img" :src="item.map.subComment[0].map.userinfo.avatar"></image>
									<view class="comment-box-big">
										<view class="left-box">
											<view class="user-nickName">{{item.map.subComment[0].map.userinfo.nick_name}}</view>
											<view class="comment-content-box">{{item.map.subComment[0].content}}<text class="time-box">{{item.map.subComment[0].create_time}}</text></view>
										</view>
										<view class="">
											<view class="like-img-box" @tap="toLike(item.map.subComment[0].id,index,'hotchild')">
												<image v-if="item.map.subComment[0].map.is_like" class="like-img" src="../../../static/jingjie/hongxin.png"></image>
												<image v-else class="like-img" src="../../../static/jingjie/huixin.png"></image>
											</view>
											<view class="like-num">{{item.map.subComment[0].like_count}}</view>
										</view>
									</view>
								</view>

								<view class="chakan-more">
									<view class="more-left" @tap="toCommentDel(item.id)">
										<view class="more-right colse">查看{{item.map.subcount}}条对话</view>
										<image src="../../../static/jingjie/youjiantou.png"></image>
									</view>
								</view>
							</view>
						</scroll-view>
						<view class="nodata" v-else>
							暂无评论
						</view>
					</view>
				</view>
				<!--最新评论-->
				<view class="comment-box-other">
					<view class="comment">
						<view class="hot-comment-other">最新评论</view>
						<scroll-view class="scrllBox2" scroll-y="true" v-if="commentList.length!=0">
							<view class="comment-conent-box yi" v-for="(item,index) in commentList" :key="index">
								<view class="first-level-comment">
									<image class="user-img" :src="item.map.userinfo.avatar"></image>
									<view class="comment-box-big">
										<view class="left-box">
											<view class="user-nickName">{{item.map.userinfo.nick_name}}</view>
											<view class="comment-content-box">{{item.content}}<text class="time-box">{{item.create_time}}</text></view>
										</view>
										<view class="">
											<view class="like-img-box" @tap="toLike(item.id,index,'new')">
												<image v-if="item.map.is_like" class="like-img" src="../../../static/jingjie/hongxin.png"></image>
												<image v-else class="like-img" src="../../../static/jingjie/huixin.png"></image>
											</view>
											<view class="like-num">{{item.like_count}}</view>
										</view>

									</view>
								</view>
								<view class="more-right" @tap="toTwoComment(item.id,item.map.userinfo.nick_name,item.map.userinfo.user_id,'newchild',index)">回复</view>
								<view class="two-level-comment" v-if="item.map.subComment&&item.map.subComment.length!=0" @tap="toTwoComment(item.id,item.map.subComment[0].map.userinfo.nick_name,item.map.subComment[0].map.userinfo.user_id,'newchild',index)">
									<image class="two-user-img" :src="item.map.subComment[0].map.userinfo.avatar"></image>
									<view class="comment-box-big">
										<view class="left-box">
											<view class="user-nickName">{{item.map.subComment[0].map.userinfo.nick_name}}</view>
											<view class="comment-content-box">{{item.map.subComment[0].content}}<text class="time-box">{{item.map.subComment[0].create_time}}</text></view>
										</view>
										<view class="">
											<view class="like-img-box" @tap="toLike(item.map.subComment[0].id,index,'newchild')">
												<image v-if="item.map.subComment[0].map.is_like" class="like-img" src="../../../static/jingjie/hongxin.png"></image>
												<image v-else class="like-img" src="../../../static/jingjie/huixin.png"></image>
											</view>
											<view class="like-num">{{item.map.subComment[0].like_count}}</view>
										</view>
									</view>
								</view>

								<view class="chakan-more">
									<view class="more-left" @tap="toCommentDel(item.id)" v-if="item.map.subComment&&item.map.subComment.length!=0">
										<view class="more-right">查看{{item.map.subcount}}条对话</view>
										<image src="../../../static/jingjie/youjiantou.png"></image>
									</view>
								</view>
							</view>
						</scroll-view>
						<view class="nodata" v-else>
							暂无评论
						</view>
					</view>
				</view>
			</view>

			<!-- <view class="input-box common">
				<input @tap="firstComment" class="inputBox" type="text" placeholder="有爱评论，说点好听的~" />
				
			</view> -->
		</view>

		<!--展示一级评论-->
		<view class="comment-alert-box" v-if="isComment">
			<view class="comment-title-box common">
				<view></view>
				<view class="title">{{subcount}}条回复</view>
				<image src="../../../static/jingjie/delete_h.png" @tap="closeComment()"></image>
			</view>
			<!--评论内容-->
			<scroll-view class="scrllBox3" scroll-y="true">
				<view class="comment-conent-box">
					<view class="first-level-comment">
						<image class="user-img" :src="commentDetaileuser.avatar"></image>
						<view class="comment-box-big">
							<view class="left-box">
								<view class="user-nickName">{{commentDetaileuser.nick_name}}</view>
								<view class="comment-content-box">{{commentDetaile.content}}</view>
							</view>
							<view class="">
								<view class="like-img-box" @tap="toLike(commentDetaile.id,index,'del')">
									<image v-if="islike" class="like-img" src="../../../static/jingjie/hongxin.png"></image>
									<image v-else class="like-img" src="../../../static/jingjie/huixin.png"></image>
								</view>
								<view class="like-num">{{commentDetaile.like_count}}</view>
							</view>
						</view>

					</view>
					<view class="chakan-more two">
						<view class="more-left style" @tap="toTwoComment(commentDetaile.id,commentDetaileuser.nick_name,commentDetaileuser.user_id,'delchild',index)">回复</view>
						<view class="time-box">{{commentDetaile.create_time}}</view>
					</view>
					<!--二级评论-->
					<view class="" v-if="subCommentList!=''">
						<view class="two-level-comment" v-for="(item,index) in subCommentList" :key="index" @tap="toTwoComment(commentDetaile.id,item.map.userinfo.nick_name,item.map.userinfo.user_id,'delchild',index)">
							<image class="two-user-img" :src="item.map.userinfo.avatar"></image>
							<view class="comment-box-big clearFlex">
								<view class="common">
									<view class="left-box">
										<view class="namebox">
											<view class="user-nickName">{{item.map.userinfo.nick_name}}</view>
											<view class="replyname" v-if="item.is_reply!=false">
												<text>回复</text>
												{{item.map.replyinfo.nick_name}}
											</view>
										</view>
										

										<view class="comment-content-box">{{item.content}}<text class="time-box">{{item.create_time}}</text></view>
									</view>
									<view class="">
										<view class="like-img-box" @tap="toLike(item.id,index,'delchild')">
											<image v-if="item.map.is_like" class="like-img" src="../../../static/jingjie/hongxin.png"></image>
											<image v-else class="like-img" src="../../../static/jingjie/huixin.png"></image>
										</view>
										<view class="like-num">{{item.like_count}}</view>
									</view>
								</view>
								<!-- <view class="twoComment common">
									<view class="huifu">回复</view>
									<view class="remove">删除</view>
								</view> -->
							</view>
						</view>
					</view>

				</view>
				<!-- <view class="border-box"></view> -->
			</scroll-view>
		</view>
		<keyFrame @toComment="toComment" :isShow="iskeyFrame" @loseFocus="loseFocus" :focusState="focusState" :huifuname="huifuname"></keyFrame>
		<mask :isShowMask='isShowMask' @closeMask='closeAlert'></mask>
	</view>
</template>

<script>
	import keyFrame from '../../../components/keyFrame.vue'
	import mask from '../../../components/mask.vue'
	export default {
		components: {
			keyFrame,
			mask
		},
		data() {
			return {
				id: '', //回应id
				haoqiid: '', //好奇id
				pinglunid: '',
				active: true,
				videosrc: '', //视频路径
				islike: '', //点赞状态
				iscollect: '', //收藏状态
				isVideoComment: false, //一级评论弹框
				iskeyFrame: false,
				isShowMask: false,
				isComment: false, //二级评论弹框
				oper_id: uni.getStorageSync('user_id'),
				videoDate: {}, //视频数据
				hotCommentList: [], //热门评论
				commentList: [], //评论列表
				nullComment: false,
				islike: null, //
				user: '',
				curiosityEntity: {},
				commentDetaile: {}, //评论详情
				subCommentList: [], //二级评论详情
				commentDetaileuser: {}, //详情用户
				subcount: '', //回复数
				huifuname: '', //回复用户的名字
				ischild: false, //判断是否是二级回复
				tuijianList: [], //推荐数据
				type:'',//回复的类型
				commentIndex:'',//回复索引
			};
		},
		onLoad(option) {
			if (option.id != undefined) {
				this.id = option.id
			}
			console.log(this.id)
		},
		onShow() {
			this.getdata()
		},
		onShareAppMessage(){
			if (res.from === 'button') { // 来自页面内分享按钮
				console.log(res.target)
			}
			return {
				title: '分享',
				path: '/pages/test/test?id=123'
			}
		},
		methods: {
			more() {
				if (this.active) {
					this.active = false
				} else {
					this.active = true
				}
			},
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			toUserDetail(id){
				uni.navigateTo({
					url:'/pages/My/myDetails/myDetails?user_id='+id
				})
			},
			shuocang() {
				if (this.oper_id == this.user_id) {
					uni.showToast({
						title: '不能收藏自己',
						icon: 'none'
					})
				} else {
					if (this.iscollect == false) {
						this.iscollect = true;
						this.videoDate.collect_count++;
						console.log(this.iscollect);
						var data = {
							user_id: this.oper_id,
							history_type: 'curiosityviewpointcollect',
							operation_type: 'collect',
							history_id: this.videoDate.id,
						};
						this.myAjaxNewPost({
							model: 'news',
							controllerName: 'history',
							actionName: 'insert',
							data: data,
							successBack: function(res) {
								console.log(res);
								uni.showToast({
									title: '已收藏',
									icon: 'none'
								})
							}
						})
					} else {
						this.iscollect = false;
						this.videoDate.collect_count--;
						if (this.videoDate.iscollect_count < 0) {
							this.videoDate.iscollect_count = 0
						}
						console.log(this.videoDate.collect_count)
						var data = {
							user_id: this.oper_id,
							history_type: 'curiosityviewpointcollect',
							operation_type: 'collect',
							history_id: this.videoDate.id,
						};
						this.myAjaxNewPost({
							model: 'news',
							controllerName: 'history',
							actionName: 'insert',
							data: data,
							successBack: function(res) {
								console.log(res);
								uni.showToast({
									title: '已取消收藏',
									icon: 'none'
								})
							}
						})
					}
				}
			},
			dianzan() {
				if (this.oper_id == this.user_id) {
					uni.showToast({
						title: '不能收藏自己',
						icon: 'none'
					})
				} else {
					if (this.islike == false) {
						this.islike = true;
						this.videoDate.like_count++;
						console.log(this.islike);
						var data = {
							user_id: this.oper_id,
							history_type: 'curiosityviewpoint',
							operation_type: 'like',
							history_id: this.videoDate.id,
						};
						this.myAjaxNewPost({
							model: 'news',
							controllerName: 'history',
							actionName: 'insert',
							data: data,
							successBack: function(res) {
								console.log(res);
								uni.showToast({
									title: '已点赞',
									icon: 'none'
								})
							}
						})
					} else {
						this.islike = false;
						this.videoDate.like_count--;
						if (this.videoDate.islike_count < 0) {
							this.videoDate.islike_count = 0
						}
						console.log(this.videoDate.like_count)
						var data = {
							user_id: this.oper_id,
							history_type: 'curiosityviewpoint',
							operation_type: 'like',
							history_id: this.videoDate.id,
						};
						this.myAjaxNewPost({
							model: 'news',
							controllerName: 'history',
							actionName: 'insert',
							data: data,
							successBack: function(res) {
								console.log(res);
								uni.showToast({
									title: '已取消点赞',
									icon: 'none'
								})
							}
						})
					}
				}
			},
			moreComment() {
				this.isShowMask = true;
				this.isVideoComment = true;
				this.iskeyFrame = true
			},
			firstComment() { //去评论
				this.iskeyFrame = true
			},
			toTwoComment(id, name, reply_id,type,index) { //二级评论
				this.iskeyFrame = true
				this.pinglunid = id
				this.huifuname = name
				this.reply_id = reply_id
				this.ischild = true
				this.type = type
				this.commentIndex = index
				console.log(this.pinglunid)
				// console.log(this.huifuname)
			},
			loseFocus() {
				this.pinglunid = ''
				this.huifuname = ''
				this.reply_id = ''
				this.ischild = false
			},
			closeAlert() {
				this.isVideoComment = false;
				this.isShowMask = false;
				this.isComment = false;
			},
			toCommentDel(id) { //查看更多评论
				this.isVideoComment = false;
				this.isComment = true;
				this.iskeyFrame = false;
				var me = this;
				var data = {
					id: id,
					oper_id: me.oper_id,
				}
				this.myAjaxNew({
					model: 'news',
					controllerName: 'curiositycomment',
					actionName: 'queryListPage',
					data: data,
					successBack: function(res) {
						console.log(res)
						if (res.data.data.length != 0) {
							me.subCommentList = res.data.data[0].map.subComment
							me.commentDetaile = res.data.data[0]
							me.commentDetaileuser = res.data.data[0].map.userinfo
							me.islike = res.data.data[0].map.is_like
							me.subcount = res.data.data[0].map.subcount
							console.log(me.commentDetaileuser)
						}
					}
				})
			},
			closeComment() { //关闭二级评论弹框
				this.isComment = false;
				this.isShowMask = false;
			},
			getdata() {
				var me = this;
				var data = {
					id: this.id,
					oper_id: me.oper_id,
				}
				this.myAjaxNew({
					model: 'news',
					controllerName: 'curiosityViewpoint',
					actionName: 'query',
					data: data,
					successBack: function(res) {
						console.log(res.data.data,'视频数据')
						me.videoDate = res.data.data[0]
						me.videoDate.create_time = me.videoDate.create_time.substring(0, 10)
						// console.log(me.videoDate,'视频数据')
						me.hotCommentList = me.videoDate.map.hotCommentList;
						if (me.hotCommentList.length == 0) {
							me.nullComment == true
						}else{
							for(var a=0;a<me.hotCommentList.length;a++){
								me.hotCommentList[a].create_time=me.myDate.getDateDiff(me.hotCommentList[a].create_time)
								if(me.hotCommentList[a].map.subComment.length!=0){
									for(var b=0;b<me.hotCommentList[a].map.subComment.length;b++){
										me.hotCommentList[a].map.subComment[b].create_time=me.myDate.getDateDiff(me.hotCommentList[a].map.subComment[b].create_time)
									}
								}
							}
						}
						me.user = me.videoDate.map.usercuriosityinfo;
						me.commentList = me.videoDate.map.commentList;
						for(var j=0;j<me.commentList.length;j++){
							me.commentList[j].create_time=me.myDate.getDateDiff(me.commentList[j].create_time)
							if(me.commentList[j].map.subComment.length!=0){
								for(var d=0;d<me.commentList[j].map.subComment.length;d++){
									me.commentList[j].map.subComment[d].create_time=me.myDate.getDateDiff(me.commentList[j].map.subComment[d].create_time)
								}
							}
						}
						me.curiosityEntity = me.videoDate.curiosityEntity;
						for(var i=0;i<me.videoDate.picStrings.length;i++){
							if(me.videoDate.picStrings[i].indexOf('http://')!=-1){
								me.videosrc = me.videoDate.picStrings[i];
							}
						}
						
						console.log(me.videosrc)
						me.haoqiid = me.curiosityEntity.id;
						me.islike = me.videoDate.map.is_like;
						me.iscollect = me.videoDate.map.is_collect;
					}
				})
				this.gettuijian()
			},
			gettuijian() {
				var me = this
				var data = {
					id: this.id, //回应id
				}
				this.myAjaxNew({
					model: 'news',
					controllerName: 'curiosityViewpoint',
					actionName: 'queryRecommendationsListPage',
					data: data,
					successBack: function(res) {
						console.log(res.data.data, '相关推荐')
						me.tuijianList = res.data.data;
						for (var i = 0; i < me.tuijianList.length; i++) {
							me.tuijianList[i].coverPics = me.tuijianList[i].coverPics[0]
						}
					}
				})
			},
			toLike(id, index, type) {
				var me = this;
				var data = {
					history_id: id,
					user_id: me.oper_id,
					operation_type: 'like',
					history_type: 'curiosityviewpointcomment'
				}
				if (type == 'new') {
					if (this.commentList[index].map.is_like == false) {
						this.commentList[index].map.is_like = true
						this.commentList[index].like_count++
					} else {
						this.commentList[index].map.is_like = false;
						this.commentList[index].like_count--;
						if (this.commentList[index].like_count < 0) {
							this.commentList[index].like_count = 0
						}
					}
				} else if (type == 'hot') {
					if (this.hotCommentList[index].map.is_like == false) {
						this.hotCommentList[index].map.is_like = true
						this.hotCommentList[index].like_count++
					} else {
						this.hotCommentList[index].map.is_like = false;
						this.hotCommentList[index].like_count--;
						if (this.hotCommentList[index].like_count < 0) {
							this.hotCommentList[index].like_count = 0
						}
					}
				} else if (type == 'del') {
					if (this.islike == false) {
						this.islike = true
						this.commentDetaile.like_count++
					} else {
						this.islike = false
						this.commentDetaile.like_count--;
						if (this.commentDetaile.like_count < 0) {
							this.commentDetaile.like_count = 0
						}
					}
				} else if (type == 'hotchild') {
					if (this.hotCommentList[index].map.subComment && this.hotCommentList[index].map.subComment.length != 0) {
						if (this.hotCommentList[index].map.subComment[0].map.is_like == false) {
							this.hotCommentList[index].map.subComment[0].map.is_like = true
							this.hotCommentList[index].map.subComment[0].like_count++
						} else {
							this.hotCommentList[index].map.subComment[0].map.is_like = false
							this.hotCommentList[index].map.subComment[0].like_count--
							if (this.hotCommentList[index].map.subComment[0].like_count < 0) {
								this.hotCommentList[index].map.subComment[0].like_count = 0
							}
						}
					}
				} else if (type == 'newchild') {
					if (this.commentList[index].map.subComment && this.commentList[index].map.subComment.length != 0) {
						if (this.commentList[index].map.subComment[0].map.is_like == false) {
							this.commentList[index].map.subComment[0].map.is_like = true
							this.commentList[index].map.subComment[0].like_count++
						} else {
							this.commentList[index].map.subComment[0].map.is_like = true
							this.commentList[index].map.subComment[0].like_count--
							if (this.commentList[index].map.subComment[0].like_count < 0) {
								this.commentList[index].map.subComment[0].like_count = 0
							}
						}
					}
				} else if (type == 'delchild') {
					if (this.subCommentList[index].map.is_like == false) {
						this.subCommentList[index].map.is_like = true
						this.subCommentList[index].like_count++
					} else {
						this.subCommentList[index].map.is_like = false
						this.subCommentList[index].like_count--
						if (this.subCommentList[index].like_count < 0) {
							this.subCommentList[index].like_count = 0
						}
					}
				}
				this.myAjaxNewPost({
					model: 'news',
					controllerName: 'history',
					actionName: 'insert',
					data: data,
					successBack: function(res) {
						console.log(res);
					}
				})
			},
			toComment(content) {
				console.log(this.type)
				var me = this;
				if (this.ischild == true) {
					this.iskeyFrame = true
					var data = {
						content: content,
						user_id: me.oper_id,
						parent_id: this.pinglunid,
						viewpoint_id: this.id,
						is_reply: true,
						reply_id: this.reply_id,
					}
				} else {
					this.isDisplay = true;
					var data = {
						content: content,
						user_id: me.oper_id,
						viewpoint_id: this.id,
					}
				}
				this.myAjaxNewPost({
					model: 'news',
					controllerName: 'curiositycomment',
					actionName: 'insert',
					data: data,
					successBack: function(res) {
						console.log(res)
						var time = new Date();
						console.log(res, '回复');
						var currentTime = me.timeProcessing.formatDate(time);
						if (res) { //这一步是将评论的内容即时显示，不需要刷新页面
							var comment = {
								map: {
									userinfo: {
										avatar: uni.getStorageSync('avatar'),
										nick_name: uni.getStorageSync('nick_name'),
									},
									replyinfo:{
										nick_name:me.huifuname
									}
								},
								content: this.data.content,
								create_time: currentTime,
								like_count:0,
							};
							if (me.ischild) { //二级评论
							var index=me.commentIndex
								if (me.type == 'hotchild') {
									console.log(me.hotCommentList[index].map.subComment,'二级评论')
									me.hotCommentList[index].map.subComment.splice(0, 0, comment)
								} else if (me.type == 'delchild') {
									me.subCommentList.splice(0, 0, comment)
								}else if(me.type=='newchild'){
									console.log(me.commentList[index].map.subComment,'二级评论')
									me.commentList[index].map.subComment.splice(0, 0, comment)
								}
							} else {
								me.commentList.splice(0, 0, comment)
							}
						}
					}
				})
				this.iskeyFrame = false
				content = ''
			},
			toDetail(id,style){
				console.log(style)
				if(style==0){
					uni.navigateTo({
						url: '../videoDetails/videoDetails?id=' + id
					})
				}else{
					uni.navigateTo({
						url: '../ImgDetails/ImgDetails?id=' + id
					})
				}
			},
			tomoreCuriosityEntity() {
				uni.navigateTo({
					url: '../moreCurious/moreCurious?id=' + this.haoqiid
				})
			},
		}

	}
</script>

<style scoped>
	.conent-box {
		height: 100%;
		position: relative;
		box-sizing: border-box;
	}

	.background {
		width: 100%;
		height: 118%;
		position: absolute;
		filter: blur(60px);
		z-index: 77;
	}

	.mask {
		width: 100%;
		height: 118%;
		background: rgba(0, 0, 0, .5);
		position: absolute;
		z-index: 88;
	}

	.head-box {
		display: flex;
		align-items: center;
		position: fixed;
		z-index: 9100;
		top: 39upx;
		left: 24upx;
	}

	.head-box .back-image {
		width: 21upx;
		height: 39upx;
	}

	.return-title {
		font-size: 32upx;
		color: white;
		margin-left: 12upx;
	}

	.video-big-box {
		position: relative;
		z-index: 1998;
	}

	.vide-box {
		width: 100%;
		height: 446upx;
		position: fixed;
		top: 0;
		z-index: 1999;
	}

	.body-box {
		width: 100%;
		height: auto;
		padding-top: 13upx;
		padding: 0 24upx;
		box-sizing: border-box;
		position: relative;
		z-index: 100;
		padding-top: 446upx;
	}

	.user-box {
		width: 100%;
		display: flex;
		align-items: center;
	}

	.user-img-box {
		width: 68upx;
		height: 68upx;
	}

	.user-img-box image {
		width: 100%;
		height: 100%;
		border-radius: 100%;
	}

	.user_new-box {
		margin-left: 15upx;
	}

	.user_nickName {
		font-size: 24upx;
		color: rgba(255, 255, 255, 1);
	}

	.user_infor {
		font-size: 20upx;
		color: rgba(204, 204, 204, 1);
		margin-top: 5upx;
	}

	.money {
		font-size: 24upx;
		color: rgba(204, 204, 204, 1);
	}

	.content-box {
		margin-top: 36upx;
		position: relative;
	}

	.left-box-conent {
		width: 625upx;
		font-size: 32upx;
		color: rgba(255, 255, 255, 1);
	}

	.right-box {
		width: 24upx;
		height: 22upx;
		position: absolute;
		top: 15upx;
		right: 0;
	}

	.right-box image {
		width: 24upx;
		height: 14upx;
		display: block;
	}

	.watch-num {
		font-size: 20upx;
		color: rgba(204, 204, 204, 1);
		margin-top: 16upx;
	}

	.shouyi {
		color: rgba(70, 206, 207, 1);
		font-size: 20upx;
		margin-right: 10upx;
	}

	.share-box {
		width: 100%;
		margin-top: 37upx;
	}

	.share-box-small {
		/* padding-left: 210upx; */
	}

	.small-box {
		display: flex;
		align-items: center;
	}

	.small-box image {
		width: 44upx;
		height: 44upx;
		margin-right: 16upx;
	}
	.shareImg {
		width: 22upx;
		height: 22upx;
		position: absolute;
		left: 0upx;
		top: 0upx;
	}

	.wenzi {
		font-size: 28upx;
		color: rgba(204, 204, 204, 1);
	}

	.comment-box {
		width: 100%;
		height: auto;
		position: relative;
		z-index: 99;
		padding: 0 24upx;
		border-bottom: 1upx solid rgba(93, 93, 93, 1);
		box-sizing: border-box;
	}

	.hot-comment {
		color: white;
		font-size: 32upx;
	}

	.comment-content {
		font-size: 24upx;
		color: white;
		margin-top: 20upx;
	}

	.more-box {
		display: flex;
		align-items: center;
		margin-top: 20upx;
		margin-bottom: 20upx;
	}

	.more-box text {
		color: rgba(255, 255, 255, 1);
		font-size: 24upx;
	}

	.more-box image {
		width: 19upx;
		height: 20upx;
		margin-left: 12upx;
	}

	.color-style {
		font-size: 24upx;
		color: rgba(204, 204, 204, 1);
	}

	.conent-box-bottom {
		padding: 0 24upx;
		position: relative;
		z-index: 99;
	}

	.conent-head-box {
		font-size: 32upx;
		color: white;
		margin-top: 38upx;
	}

	.recommend-box {
		width: 100%;
		height: 200upx;
		display: flex;
		align-items: center;
		margin-top: 25upx;
		margin-bottom: 30upx;
	}

	.left-img-box {
		width: 200upx;
		height: 200upx;
	}

	.left-img-box image {
		width: 100%;
		height: 100%;
		border-radius: 10upx;
	}

	.right-conent-box {
		margin-left: 30upx;
	}

	.fontStyle {
		width: 460upx;
		font-size: 32upx;
		color: white;
		margin-bottom: 15upx;
	}

	.class-title {
		width: 120upx;
		height: 40upx;
		border: 1upx solid white;
		border-radius: 10upx;
		font-size: 24upx;
		color: white;
		text-align: center;
		line-height: 40upx;
	}

	.about-box {
		width: 100%;
		height: 98upx;
		padding: 0 24upx;
		box-sizing: border-box;
		position: relative;
		z-index: 99;
	}

	.about-right-box {
		max-width: 465upx;
		color: rgba(70, 206, 207, 1);
		font-size: 28upx;
		margin-top: 30upx;
		border-bottom: 1upx solid rgba(70, 206, 207, 1);
	}

	.delete {
		width: 24upx;
		height: 24upx;
	}

	/**评论**/
	.video-alert-box {
		width: 100%;
		height: 888upx;
		background: #1C1C23;
		position: fixed;
		z-index: 9999;
		bottom: 130upx;
		color: #FFFFFF;
	}

	.bianju {
		margin-bottom: 85upx;
	}

	.comment-box-other {
		width: 100%;
		height: auto;
		padding: 0 24upx;
		border-bottom: 1upx solid #999999;
		/* margin-top: 30upx; */
		box-sizing: border-box;
	}

	.comment {
		width: 100%;
		padding-top: 29upx;
		/* padding-bottom: 41upx; */
	}

	.text1 {
		font-size: 24upx;
		color: #FFFFFF;
		padding: 24upx;
	}

	.hot-comment-other {
		color: #FFFFFF;
		font-size: 32upx;
		font-weight: bold;
		padding-bottom: 10upx;
	}

	.more-comment {
		display: flex;
		align-items: center;
		margin-top: 20upx;
	}

	.scrllBox {
		width: 100%;
		height: 340upx;
	}

	.scrllBox2 {
		width: 100%;
		height: 420upx;
	}

	.scrllBox3 {
		width: 100%;
		height: 1080upx;
	}

	.comment-conent-box {
		width: 100%;
		padding: 0 24upx;
		box-sizing: border-box;
		background: rgba(28, 28, 35, 1);
	}

	.comment-conent-box.yi {
		padding: 0;
		margin-top: 26upx;
	}

	.user-img {
		width: 68upx;
		height: 68upx;
		border-radius: 68upx;
	}

	.comment-box-big {
		width: 630upx;
		display: flex;
		justify-content: space-between;
		margin-left: 17upx;
	}

	.two-level-comment {
		width: 620upx;
		display: flex;
		padding-left: 12upx;
		padding-bottom: 20upx;
		margin-left: 68upx;
		margin-top: 20upx;
		padding-top: 15upx;
		background-color: rgba(255, 255, 255, 0.1);
		border-radius: 10upx;
		color: #CCCCCC;
	}

	.clearFlex {
		display: block;
	}

	.left-box {
		max-width: 430upx;
	}

	.user-nickName {
		font-size: 24upx;
		color: #CCCCCC;
		margin-right: 24upx;
	}

	.replyname {
		font-size: 24upx;
		color: #CCCCCC;
	}

	.replyname text {
		margin-right: 24upx;
	}

	.comment-content-box {
		font-size: 26upx;
		color: #FFFFFF;
	}

	.like-img-box {
		width: 50upx;
		text-align: center;
	}

	.like-img {
		width: 32upx;
		height: 28upx;
	}

	.like-num {
		width: 50upx;
		text-align: center;
		font-size: 20upx;
		color: rgba(102, 102, 102, 1);
	}

	.twoComment {
		width: 100%;
		margin-top: 20upx;
	}

	.huifu {
		color: rgba(153, 153, 153, 1);
		font-size: 20upx;
	}

	.remove {
		color: #FFFFFF;
		font-size: 24upx;
	}

	.border-box {
		width: 100%;
		height: 1upx;
		background: rgba(230, 230, 230, 1);
		margin-top: 20upx;
	}

	.time-box {
		font-size: 20upx;
		margin-left: 20upx;
		color: rgba(153, 153, 153, 1);
	}

	.two-user-img {
		width: 40upx;
		height: 40upx;
		border-radius: 40upx;
	}

	.xiala-big-box {
		display: flex;
		align-items: center;
		margin-left: 17upx;
	}

	.xiala {
		width: 18upx;
		height: 8upx;
		margin-left: 10upx;
	}

	.input-box {
		width: 100%;
		height: 88upx;
		background: white;
		position: fixed;
		z-index: 999;
		bottom: 0;
		padding: 0 24upx;
		box-sizing: border-box;
	}

	.inputBox {
		width: 100%;
		font-size: 26upx;
		color: rgba(153, 153, 153, 1);
		border: 1px solid rgba(204, 204, 204, 1);
		border-radius: 10upx;
		padding-left: 15upx;
	}

	.smilingFace {
		width: 45upx;
		height: 45upx;
	}

	.shuliang {
		color: rgba(51, 51, 51, 1);
		font-size: 20upx;
		margin-left: 5upx;
	}

	.chakan-more {
		width: 620upx;
		display: flex;
		align-items: center;
		padding-bottom: 20upx;
		padding-top: 15upx;
	}

	.chakan-more.two {
		margin-top: 0upx;
		padding-top: 0upx;
		padding-bottom: 0upx;
		padding-left: 82upx;
	}

	.more-left {
		display: flex;
		align-items: center;
	}

	.style {
		color: #FFFFFF;
		font-size: 24upx;
	}

	.more-left image {
		width: 19upx;
		height: 20upx;
		margin-left: 12upx;
	}

	.more-right {
		color: #FFFFFF;
		font-size: 24upx;
		margin-left: 84upx;
	}

	.more-right.close {
		margin-left: 0;
	}

	.first-level-comment {
		display: flex;
	}

	/*二级评论*/
	.comment-alert-box {
		width: 100%;
		height: 1175upx;
		background: #1C1C23;
		border-radius: 10upx 10upx 0upx 0upx;
		position: fixed;
		bottom: 0;
		z-index: 9999;
	}

	.comment-title-box {
		margin-bottom: 20upx;
		padding: 22upx 24upx;
		box-sizing: border-box;
		background: #000000;
	}

	.title {
		font-size: 24upx;
		color: rgba(153, 153, 153, 1);
	}

	.comment-title-box image {
		width: 19upx;
		height: 19upx;
	}

	.namebox {
		display: flex;
	}
	.nodata{
		font-size: 24upx;
		color: #CCCCCC;
		text-align: center;
		width: 100%;
		line-height: 388upx;
	}
</style>
